<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>发起合租招募</title>
    <link rel="stylesheet" href="/css/bootstrap.css">
    <script src="/js/jquery.js"></script>
    <script src="/js/distpicker.js"></script>
    <script src="/js/bootstrap.js"></script>
    <style>
        .top-buffer1{
            margin-top: 20px;
        }
        .top-buffer2{
            margin-top: 10px;
        }
        .top-buffer-max{
            margin-top: 100px;
        }
    </style>
<body>
<div class="panel panel-success top-buffer-max">
    <div class="panel-heading">
        <h3 class="panel-title top-buffer" style="text-align: center">合租招募信息</h3>
    </div>
        <form  class="row g-3" id="order_form" enctype="multipart/form-data" style="border: none">

<!--            <input type="text" name="userid" th:value="${session.user.userid}" style="display: none">-->
<!--            <input type="text" name="houseid" th:value="${session.Onehouse.houseid}" style="display: none">-->

            <div class="row top-buffer1">
                <div class="col-md-12">
                    <label for="order_description" class="top-buffer1">合租需求描述</label>
                    <textarea class="form-control top-buffer2" rows="10" placeholder="请输入内容" id="order_description" name="orderdescription" required></textarea>
                </div>
            </div>
            <div class="row top-buffer1">
                <div style="text-align: center">
                    <button class="btn btn-outline-dark top-buffer1" style="width: 40%;" type="button" onclick="addOrder()">发布</button>
                </div>
            </div>

        </form>
    </div>
<script>

    function addOrder() {
        var formData = new FormData($("#order_form")[0]);

        $.ajax({
            url: "/order/addNewOrder",
            type: 'POST',
            data: formData,
            processData: false,
            contentType: false,
            success: function () {
                alert("success!");
            },
            error: function (req, status, error) {
                alert("请求处理出错!!!" + error);
            }
        });
    }
</script>
</body>
</html>